The ChainMail project was done as part of my course work, when completing my certificate in UX Design, through GetSmarter/UCT. Most of the information within this portfolio entry is from the min the UX study that was completed. 

The purpose of this UX study is to showcase the process that was followed during the redesign of the user experience of ChainMail. It contains a depth user study that was completed to understand the issues users’ have with ChainMail. The information gained from this was then analyzed through a HEM method, this was then used to guide the design of the UX, through prototypes. The final was then retested with users to see if the changes made were of value.

ChainMail is web-based email client, with a focus on security and privacy. The ChainMail team approached me for service, because they felt that their user experience was pushing users away and active user numbers were dropping. Adding to this the sign-up experience was discouraging new users from signing up due to a poor sign-up process.

ChainMail set out to create a product that would provide a user with a safe, secure, and private way to interface with their emails. Their main user base targeted was professionals, though they wanted to include everyday people that would value safety, security, and privacy. This is where ChainMail failed as their interface put too much focus on security which overwhelmed their users, they also failed to update the look of their interface to match that of modern-day standards.

After the brief, the first step was initial research to understand ChainMail, and its user base. This was to identify current and potential users, as well as use cases. Next was the stakeholder meeting, the meeting was to understand their objectives of each stakeholder. Following this was user testing, the testing was done on current users in order to understand the current issues with UX. From this, personas were created to present the user base. A usage hypothesis for the current ChainMail interface is created. The data gathered during the testing was evaluated, analysed, and reported back to the stakeholders. This step is completed to explain to stakeholders the findings and in what direction the findings are guiding the project. The aesthetic design brief is created next, this is giving the UI designer an understanding of the look and feel, the project is heading in. Next as the UX design, I created the wireframes. The wireframes were first created through rough sketches on paper later been transferred into software, that in the case of this project was Figma. These wireframes were then refined based on team feedback. This feedback was used to refine the wireframes into prototypes through Figma. Once the functional prototypes were completed, user testing was done, for both further refinement and understanding how user would interact with the interface. From this a new usage hypothesis created. Finally, the UX design report was created. Adding to this a presentation, to present to stakeholders is created to go hand in hand with the report. With that the process is complete.

The initial research set out was to find what the issues with the ChainMail user experience. This was completed by initial identifying the current user base, and the common use case for ChainMail. Once the users were identified, the user testing was created, these tests were conducted based on three methods; one was the System Usability Scale, two was the Measurable requirements test questions, and finally the Multivariate test. Each of these tests helped us to identify issues users found with the ChainMail user experience. More specifically the multivariate help us test ChainMail against its competition, see what users like in those experiences helped us identify what was lucking compared to the current market. The data gathered from these tests was then analysed through the HEM method. This method allows us breakdown the data based on how creditable it is based on the usage hypotheses. The breakdown allows us to see what information to focus on moving into the wireframing, thus creating the new user experience based on user requirements.

Starting with the sign-up page, it’s been broken up into two sections, one for basic details, and two for security details. This done due to users wanting security options to be optional. Next the inbox page, starting with the navbar, it houses the logo, account setting, general settings, and security settings. Its also home to the quick lock bottom, quick lock gives users the ability to lock their inbox while they step away for a period. Jumping to the folder column users can manage and create new folders for emails. At the top of this is the compose button, in green to highlight it from the page. At the bottom is the support button. Next column is displays email details, next to this is the shield column. The shields give the users safety information about email briefly using colour, they clickable for more details. The empty space is for viewing and creating emails, with a tool bar above for managing this.

One of the first findings, was to do with sign-ups. It was found that users prefer a simple and fast sign-up, even if its at the cost of reducing security requirements. Especially requirements that can not be skip, for example the use of OTP. Thus, we could assume reducing security will increase sign-up time, and simplicity. Though security should still be pushed, but the final decision left to the user.

A surprizing finding is that user want a balance between the system managing spam and the user. With the users having more control, adding to this the managing of this control should be an easy and clear task within the interface, as users indicate frustration with such complex tasks. An example with be to use coloured icons.

The next finding to point out is that users prefer a simpler contact layout. Its shows that an important consideration of well-placed icons and menus leading the users to easily add a contact, makes the task easy and clear.

The next finding, states that user would find a timeout feature, that locks the inbox useful, but they would prefer to control it. This finding was very split, for it, and against it, should be considered optional requirement.

Another close finding of for and against, was having an undo button or undo period before an email is sent. Because ChainMail is target to a professional market, time is important when send an email, thus the time period feature gets in the way. Users do state an undo button that appears for a short period, would be useful, but it should be an optional feature.

https://www.figma.com/proto/LoVSPaP3sGKAujKOa9Wsz6/ChainMail?page-id=9%3A553&node-id=9%3A572&viewport=241%2C48%2C0.2&scaling=min-zoom&starting-point-node-id=18%3A664&show-proto-sidebar=1

For the UI Designers, the overall design needs to be simple and modern, a good reference in this case to follow is Google’s material UI. We need to remember the main user group is professionals, who except an interface to be easily learnable and not visually overwhelming. So, I would suggest using a 5 colour pallet, matching the brand, to ensure that strong brand identity can be found throughout the interface. In terms of layout, there should be a lean towards the more traditional email client layout, as this will make the interface more intuitive to users. Adding to the intuitive, the visuals should help guide the user through ChainMail specific features, making them become second nature. This can be achieved through good use of shapes, colour, and consistency through the interface.

For the developers, as stated with the UI Designers, our main user group is professionals, thus the interface needs to be quick and responsive. This can be achieved by only using basic aminations, or none. Another important require that came up in testing is feedback, we need to ensure that when a user clicks on a button or link, that they receive feedback. Finally user flow testing and bug testing should be carried out through the life span of the product, if we ensure a stable product, it will create user retention.